<template>
  <div>
    <h2>这是首页标题</h2>
    <p>这是首页的内容，呵呵呵</p>
    <router-link to="/home/news">新闻</router-link>
    <router-link to="/home/messages">消息</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
  export default {
    name: "home",
    data() {
      return {
        path: '/home/news'
      }
    },
    created() {
      console.log('home created');
    },
    destroyed() {
      console.log('home destroyed');
    },
    // 这两个函数, 只有该组件被保持了状态使用了keep-alive时, 才是有效的
    activated() {
      console.log('activated');
      this.$router.push(this.path);
    },
    deactivated() {
      console.log('deactivated');
    },
    // 组件内导航守卫
    beforeRouteLeave(to, from, next) {
      this.path = this.$route.path; // 获取当前路由path
      next();
    }
  }
</script>

<style scoped>

</style>
